<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" %>

<!DOCTYPE html>
<html>
<head>
    <jsp:include page="/WEB-INF/jsp/include/headBase.jsp"/>
    <jsp:include page="/WEB-INF/jsp/include/footerBase.jsp"/>
</head>
<body style="padding: 5px">
<div class="nav-tabs-custom">
    <ul class="nav nav-tabs">
        <li class="active">
            <a href="#tab_automatic" data-toggle="tab">
                <span class="glyphicon glyphicon-user"></span><b>自动抽取</b></a></li>
        <li>
            <a href="#tab_manually" data-toggle="tab">
                <span class="glyphicon glyphicon-home"></span><b>手动抽取</b></a></li>
        <li>
            <a href="#tab_result" data-toggle="tab">
                <span class="glyphicon glyphicon-book"></span><b>抽取结果</b></a></li>
    </ul>
    <div class="tab-content">
        <%--1自动抽取--%>
        <div class="tab-pane active" id="tab_automatic" data-url="${base}/httpPage/gongXu/automatic?idCard=${idCard}">
            <jsp:include page="automatic.jsp"></jsp:include>
        </div>
        <%--2手动抽取--%>
        <div class="tab-pane" id="tab_manually" data-url="${base}/httpPage/gongXu/manually?idCard=${idCard}">
            <jsp:include page="manually.jsp"></jsp:include>
        </div>
        <%--3抽取结果--%>
        <div class="tab-pane" id="tab_result" data-url="${base}/httpPage/gongXu/result?idCard=${idCard}">
            <jsp:include page="result.jsp"></jsp:include>
        </div>
    </div>
</div>


<div class="modal fade" id="myModal">
    <div class="modal-dialog  modal-lg ">
        <div class="modal-content ">

        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script>
    var $table_result = $("#table_result"),
            $btn_result = $("#btn_result"),

            $table_manually = $("#table_manually"),
            $btn_manually = $("#btn_manually"),

            $table_automatic = $("#table_automatic"),
            $btn_automatic = $("#btn_automatic");


        window.events = {

            'click .nameClick': function (e, value, row, index) {
                $('#myModal').modal({
                    backdrop: 'static',
                    keyboard: false,
                    show: true,
                    remote: '${base}/httpPage/expertInfoDlg?idCard=' + row.idCard
                });
            },

            'click .checkExpert': function (e, value, row, index) {
                $table_result.bootstrapTable('insertRow', {index: 0, row: row});
                $table_manually.bootstrapTable('updateRow', {index: index, row: row});
            },

            'click .checkLeader': function (e, value, row, index) {
                $table_result.bootstrapTable('removeAll');
                var data = $table_automatic.bootstrapTable('getOptions').data;
                for (var i = 0; i < data.length; i++) {
                    $table_result.bootstrapTable('insertRow', {index: i, row: data[i]});
                }
                $table_result.bootstrapTable('check', 0);
            },

            'click .unCheckExpert': function (e, value, row, index) {
                $table_result.bootstrapTable('remove', {field: 'idCard', values: [row.idCard]});
                var data = $table_manually.bootstrapTable('getOptions').data, str = "";
                for (var i = 0; i < data.length; i++) {
                    if (row.idCard == data[i].idCard) {
                        $table_manually.bootstrapTable('updateRow', {index: i, row: row});
                    }
                }
            }


        };


        $("#myModal").on("hidden.bs.modal", function () {
            $(this).removeData("bs.modal");
            $(this).find(".modal-content").html("");
        });


    $(function () {
        $.sysPlugin.initDateTimeInput();
        $.sysPlugin.initSimpleSelect2();
    });


</script>


</body>
</html>